<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"    
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <ui:composition template="../TemplateAdmin.xhtml">
        <ui:define name="title">
            <h:outputText value="Staff Process Project"></h:outputText>
        </ui:define>       
        <ui:define name="body">
            <h:form>              
        
                <p:dataTable id="dataTable" rowIndexVar="rowIndex"  var="item" value="#{projectController.getListManagerProject(loginController.managerLogin.mnID)}"
                             paginator="true" rows="5" paginatorPosition="bottom" resizableColumns="true"
                                 paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                                 rowsPerPageTemplate="5,10,15" style="width: 100%" widgetVar="roomTable" rendered="#{not empty loginController.managerLogin}">
                        
                        <f:facet name="header">
                            <h:outputText value="List of Projects" />                            
                            <p:outputPanel style="float: right">
                                <h:outputText value="Search all fields "  />
                                <h:inputText id="globalFilter" onkeyup="roomTable.filter();"  />
                            </p:outputPanel>
                        </f:facet>
                        <p:ajax event="rowEdit" listener="#{projectController.onEdit}" />
                        <p:ajax event="rowEditCancel" listener="#{projectController.onEditCancel}" />

                        <p:column sortBy="#{item.prID}" headerText="ID"
                                  filterMatchMode="exact" filterBy="#{item.prID}">          
                            <p:cellEditor>
                                <f:facet name="output">
                                    <h:outputText value="#{item.prID}"/>
                                </f:facet>
                                <f:facet name="input">
                                    <h:outputText value="#{item.prID}" style="width: 100%"/>
                                </f:facet>
                            </p:cellEditor>  
                        </p:column>

                        <p:column sortBy="#{item.odID.odID}" headerText="Order" >
                            <p:cellEditor>
                                <f:facet name="output">
                                    <h:outputText value="#{item.odID.odID}"/>
                                </f:facet>
                                <f:facet name="input">
                                    <h:outputText value="#{item.odID.odID}"/>
                                </f:facet>
                            </p:cellEditor>  
                        </p:column>

                        <p:column sortBy="#{item.prState}" headerText="State" >
                            <p:cellEditor>
                                <f:facet name="output">
                                    <h:outputText value="#{item.prState}"/>                            
                                </f:facet>
                                <f:facet name="input"> 
                                    <p:selectOneMenu value="#{item.prState}" id="prState" style="width: 100%">   
                                        <f:selectItem itemLabel="Select One" itemValue="" />
                                        <f:selectItem itemLabel="Project chưa được bắt đầu" itemValue="1" />
                                        <f:selectItem itemLabel="Project đang được thực hiện" itemValue="2" />
                                        <f:selectItem itemLabel="Project đang cần bảo trì" itemValue="3" />
                                        <f:selectItem itemLabel="Project đang được bảo trì" itemValue="4" />
                                        <f:selectItem itemLabel="Project đã hoàn thiện" itemValue="5" />
                                    </p:selectOneMenu>
                                </f:facet>
                            </p:cellEditor> 
                        </p:column>

                        <p:column sortBy="#{item.pdImageURL}" headerText="URL Image" >
                            <p:cellEditor>
                                <f:facet name="output">
                                    <h:outputText value="#{item.pdImageURL}"/>
                                </f:facet>
                                <f:facet name="input">   
                                    <p:inputText value="#{item.pdImageURL}" />
                                </f:facet>
                            </p:cellEditor>
                        </p:column>
                        <p:column sortBy="#{item.prCreated}" headerText="Created Date"
                                  filterBy="#{item.prCreated}" filterMatchMode="exact">
                            <p:cellEditor>
                                <f:facet name="output">         
                                    <h:outputText value="#{item.prCreated}">
                                        <f:convertDateTime pattern="MM/dd/yyyy" />
                                    </h:outputText>
                                </f:facet>
                                <f:facet name="input"> 
                                    <h:inputText value="#{item.prCreated}" >
                                        <!--<p:calendar id="CreatedDate" navigator="true" mode="popup" showOn="button"
                                                    pattern="MM/dd/yyyy " 
                                                    value="#{item.prCreated}">
                                            <f:convertDateTime pattern="MM/dd/yyyy" />
                                        </p:calendar>-->
                                    </h:inputText>
                                </f:facet>
                            </p:cellEditor>
                        </p:column>

                        <p:column sortBy="#{item.prCompleted}" headerText="Completed Date"
                                  filterBy="#{item.prCompleted}">                      
                            <p:cellEditor>
                                <f:facet name="output">         
                                    <h:outputText value="#{item.prCompleted}">
                                        <f:convertDateTime pattern="MM/dd/yyyy" />
                                    </h:outputText>
                                </f:facet>
                                <f:facet name="input">   
                                    <h:inputText  value="#{item.prCompleted}">
                                        <!--     <p:calendar id="CompletedDate" navigator="true" mode="popup" showOn="button"
                                                         pattern="MM/dd/yyyy " 
                                                         value="#{item.prCompleted}">
                                                 <f:convertDateTime pattern="MM/dd/yyyy" />
                                             </p:calendar>-->
                                    </h:inputText>
                                </f:facet>
                            </p:cellEditor>
                        </p:column>

                        <p:column sortBy="#{item.mnID.mnName}" headerText="Manager">                    
                            <p:cellEditor>
                                <f:facet name="output">
                                    <p:commandLink value="#{item.mnID.mnName}" id="mnID" />
                                    <!--show ra items manager -->
                                    <p:overlayPanel id="DetailsManagerPanel" for="mnID" hideEffect="fade" dynamic="true">  
                                        <h:panelGrid columns="2">
                                            <h:outputText value="ManagerID:"/>
                                            <h:outputText value="#{item.mnID.mnID}" title="ManagerID"/>
                                            <h:outputText value="ManagerName:"/>
                                            <h:outputText value="#{item.mnID.mnName}" title="ManagerID"/>
                                            <h:outputText value="UserName:"/>
                                            <h:outputText value="#{item.mnID.mnUserName}" title="UserName"/>
                                            <h:outputText value="Email:"/>
                                            <h:outputText value="#{item.mnID.mnEmail}" title="Email"/>
                                            <h:outputText value="Address:"/>
                                            <h:outputText value="#{item.mnID.mnAdress}" title="Address"/>
                                            <h:outputText value="Phone:"/>
                                            <h:outputText value="#{item.mnID.mnPhone}" title="Phone"/>
                                            <h:outputText value="Status:"/>
                                            <h:outputText value="#{item.mnID.mnStatus}" title="Status"/>
                                            <h:outputText value="Permission"/>
                                            <h:outputText value="#{item.mnID.mnPermission}" title="Permission"/>
                                        </h:panelGrid>
                                    </p:overlayPanel>
                                </f:facet>
                                <f:facet name="input">
                                    <p:commandLink value="#{item.mnID}" />
                                </f:facet>
                            </p:cellEditor>   
                        </p:column>

                        <p:column headerText="Enable" sortBy="#{item.prEnable}">
                            <p:cellEditor>
                                <f:facet name="output">
                                    <h:outputText value="#{item.prEnable}"/>
                                </f:facet>
                                <f:facet name="input">
                                    <h:selectBooleanCheckbox value="#{item.prEnable}" />
                                </f:facet>
                            </p:cellEditor>                    
                        </p:column> 
                        <!--cot hien thi các nút xóa, ...view ...-->
                        <p:column>
                            <f:facet name="header">
                                <h:outputText value=""/>
                            </f:facet>
                            <p:commandButton action="#{projectController.prepareView(item)}"   icon="ui-icon-extlink"                                             
                                             title="Detail" value="Detail"  >
                            </p:commandButton>                       
                        </p:column>
                        <p:column>
                            <p:rowEditor/>
                        </p:column>

                    </p:dataTable>
               
            </h:form>
        </ui:define>
    </ui:composition>
</html>

